<template>
  <div id="app">
    <div class="office_container">
      <div class="condition_box">
        <div class="city_box">
          <span style="color:#999;margin:2px 0px 0px 5px;position:relative">城市</span>
          <ul class="list_city" v-if="showcitys==0">
            <li
              v-for="(item,index) in old_citylist.slice(0,10)"
              :class="{'actived':city_index === item.id}"
              @click="showcitymarks(item,index)"
            >{{item.zh_name}}</li>
            <div style="clear:both;"></div>
          </ul>
          <ul class="list_city" v-if="this.showcitys==1">
            <li
              v-for="(item,index) in old_citylist"
              :class="{'actived':city_index === item.id}"
              @click="showcitymarks(item,index)"
            >{{item.zh_name}}</li>
          </ul>
          <div style="clear:both;"></div>
        </div>
        <div class="type_box">
          <span style="color:#999;margin:2px 0px 0px 5px;">类型</span>
          <ul class="list_type">
            <li
              v-for="(item,index) in officetype"
              :class="{'actived':type === index}"
              @click="showtype(item,index)"
            >{{item.zh_name}}</li>
          </ul>
        </div>
        <div class="position_box">
          <span style="color:#999;margin:2px 0px 0px 5px;">位置</span>
          <ul class="list_position">
            <li
              v-for="(item,index) in position"
              :class="{'actived':position_index === item.index}"
              @click="showposition(item,index)"
              style="margin-top:-3px;"
            >
              {{item.zh_name}}
              <i class="iconfont icon-arrow" style="margin:0.5vh 0px 0px 0.5vw;"></i>
            </li>
          </ul>
        </div>
        <div class="type_boxs" v-if="this.chooseArea == 0">
          <ul class="list_type" v-if="this.chooseArealist==0">
            <li
              v-for="(item,index) in arealist"
              :class="{'actived':area_index === index}"
              @click="showarea(item,index)"
            >{{item.zh_name}}</li>
          </ul>
          <ul class="list_type" v-if="this.chooseArealist==1">
            <li
              v-for="(item,index) in arealists"
              :class="{'actived':area_index === index}"
              @click="showarea(item,index)"
            >{{item.zh_name}}</li>
          </ul>
          <i
            class="iconfont icon-arrowdown"
            :style="iconStyles"
            @click="showmoreArea"
            v-if="this.subwayarrow==0"
          ></i>
          <i
            class="iconfont icon-arrowon"
            :style="iconStyles"
            @click="showoldArea"
            v-if="this.subwayarrow==1"
          ></i>
          <div style="clear:both;"></div>
        </div>

        <div class="type_boxs" v-if="this.chooseArea == 1">
          <ul class="list_types" v-if="this.subwayarrow == 0">
            <li
              v-for="(item,index) in subwaylist"
              :class="{'actived':subway_index === index}"
              @click="showsubway(item,index)"
            >{{item.route_name}}</li>
          </ul>
          <ul class="list_types" v-else>
            <li
              v-for="(item,index) in subwaylists"
              :class="{'actived':subway_index === index}"
              @click="showsubway(item,index)"
            >{{item.route_name}}</li>
          </ul>
          <i
            class="iconfont icon-arrowdown"
            :style="iconStyles"
            @click="showmoresubway"
            v-if="this.subwayarrow==0"
          ></i>
          <i
            class="iconfont icon-arrowon"
            :style="iconStyles"
            @click="showmoldSubway"
            v-if="this.subwayarrow==1"
          ></i>
          <div style="clear:both;"></div>
        </div>

        <div class="price_box">
          <span style="color:#999;margin:2px 0px 0px 5px;">价格</span>
          <ul class="list_price" v-if="this.showPrices==1">
            <li v-for="(item,index) in pricelist" :class="{'actived':price_index === index}" @click="ChoosePrice(item,index)">{{item.lowPrice}}{{item.ind}}{{item.highPrice}} {{item.zh_name}}</li>
            <li>
                <el-input v-model="searchparams.lowPrice" :min="0" size="small" :style="Inputstyle"></el-input>
                <span class="line">-</span>
                <el-input v-model="searchparams.highPrice" :min="0" size="small" :style="Inputstyle" @keyup.enter.native="fetchDIYPrice"></el-input>
                <span>元 / m² / 天</span>
            </li>
          </ul>
          <ul class="list_prices" v-else>
            <li
              v-for="(item,index) in pricelists"
              :class="{'actived':price_index === index}"
              @click="ChoosePrice(item,index)"
            >{{item.lowPrice}}{{item.ind}}{{item.highPrice}} {{item.zh_name}}</li>
            <li>
                <el-input :min="0" v-model="searchparams.lowPrice" size="small" :style="Inputstyle"></el-input>
                <span class="line">-</span>
                <el-input :min="0" v-model="searchparams.highPrice" size="small" :style="Inputstyle" @keyup.enter.native="fetchDIYPrice"></el-input>
                <span>元 / 人 / 月</span>
            </li>
          </ul>
        </div>

        <div class="person_box" v-if="this.showPrices!=1">
          <span style="color:#999;margin:2px 0px 0px 5px;position:relative">人数</span>
          <ul class="list_price">
            <li
              v-for="(item,index) in personlists"
              :class="{'actived':person_index === index}"
              @click="showperson(item,index)"
            >{{item.lowPerson}}{{item.ind}}{{item.highPerson}} {{item.zh_name}}</li>
            <li>
              <el-input v-model="searchparams.lowPerson" size="small"  :min="0"  :style="Inputstyle"></el-input>
              <span class="line">-</span>
              <el-input v-model="searchparams.highPerson" size="small"  :min="0"  :style="Inputstyle" @keyup.enter.native="fetchDIYPerson"></el-input>
              <span>人</span>
            </li>
          </ul>
        </div>

        <div class="area_box">
          <span style="color:#999;position:relative;margin:2px 0px 0px 5px;">面积</span>
            <ul class="list_price">
              <li
                v-for="(item,index) in acreagelist"
                :key="index"
                :class="{'actived':areas_index === index}"
                @click="showareas(item,index)"
              >{{item.lowArea}}{{item.ind}}{{item.highArea}} {{item.zh_name}}</li>
              <li>
                <el-input v-model="searchparams.lowArea" :min="0" size="small" :style="Inputstyle"></el-input>
                <span class="line">-</span>
                <el-input size="small" v-model="searchparams.highArea" :style="Inputstyle" :min="0" @keyup.enter.native="fetchDIYArea"></el-input>
                <span>m²</span>
              </li>
            </ul>
        </div>
        <div class="selected_box" style="width:1366px">
          <div class="selected_box" :class="SelectBarFixed == true ? 'seleceFixed' :'selected_box'">
            <span :style="{color:'#999','line-height':lineheight,position:'relative',marginLeft:'5px'}">已选</span>
            <ul class="list_selected">
              <li v-for="(item,index) in cityarr">
                <span>{{item.zh_name}}</span>
              </li>
              <li v-for="(item,index) in typearr">
                <span>{{item.zh_name}}</span>
              </li>
              <li v-for="(item,index) in regionarrr" class="list_selectedte">
                <div v-if="item.zh_name!='不限'">
                  <span v-if="item.zh_name!='不限'" >
                    {{item.zh_name}}
                    <sup :style="deleteiconstyle" @click="deletePosition(index)">X</sup>
                  </span>
                </div>
              </li>
              <li v-for="(item,index) in pricearr" class="hanggao">
                <span>
                  {{item.zh_name}}
                  <sup :style="deleteiconstyle" @click="deletePrice(index)">X</sup>
                </span>
              </li>
              <li v-for="(item,index) in personarr" class="hanggao">
                <span>
                  {{item.zh_name}}
                  <sup :style="deleteiconstyle" @click="deletePerson(index)">X</sup>
                </span>
              </li>
              <li v-for="(item,index) in areaarr" class="hanggao">
                <span>
                  {{item.zh_name}}
                  <sup :style="deleteiconstyle" @click="deleteArea(index)">X</sup>
                </span>
              </li>
              <li v-if="this.searchWord!=''" class="hanggao">
                <span>
                  {{searchWord}}
                  <sup :style="deleteiconstyle" @click="deletesearch">X</sup>
                </span>
              </li>
            </ul>
          </div>
        </div>
      </div>
    </div>
     <!-- 房源列表 -->
      <div class="tagBox">
        <div class="tags">
          <ul class="taglist">
            <li v-for="(item,index) in taglist" :key="index" class="tag_container">
              <img :src="item.src" alt="" srcset="" class="tagImg">
              <span class="tagName">{{item.label}}</span>
            </li>
          </ul>
          <div class="sortBox">
            <span class="comprehensive" @click="comprehensiveprice" :class="showprice == 1 ? 'priceactive':'priceunactive'">综合排序</span>
            <span class="pricesort" :class="showprice != 1 ? 'priceactive':'priceunactive'" @click="changeOrder">价格排序</span> 
            <i class="iconfont icon-arrowup" style="font-size:16px;margin-top:15px;cursor:default" :class="showprice == 2 ? 'priceactive':'priceunactive'"></i>
            <i class="iconfont icon-arrowdown1"  style="font-size:16px;margin-bottom:5px;cursor:default" :class="showprice == 3 ? 'priceactive':'priceunactive'"></i>
          </div>
        </div>
      </div>
    <div class="house_box_noresult" v-if="this.houselist.length == 0&&this.backgroundIndex==1">
      <img src="../../assets/img/noresult.png" alt  v-if="this.backgroundIndex==1"/>
      <p class="phonetext" v-if="this.backgroundIndex==1">
        拨打热线 400-882-2692 
      </p>
      <p class="zytext" v-if="this.backgroundIndex==1">
        房大专员将为您提供更合适的房源
      </p>
    </div>
    <div class="house_box" v-if="this.houselist&&this.houselist.length >0">
      <div class="house_box_left">
        <ul class="house_list" id="houselist" v-if="this.houselist.length >0">
          <img src="../../assets/img/guanggao.png" alt="" class="guanggao">
          <li v-for="(item,index) in houselist" class="house_container" :key="index"
            @mouseleave="hidemorebtn(item,index)" @mouseover="changelabel(item,index)" :class="index === 0?'house_li':'house_container'">
            <router-link target="_blank" :to="{path:'/home/office/' + city_id + '/'+item.id}" class="opentag">
              <ul>
                <li class="house_container_poster" v-if="item.logo">
                  <img :src="item.logo" alt class="poster" />
                </li>
                <li class="house_container_poster" v-else>
                  <img src="../../assets/img/nopic.png" alt class="poster" />
                </li>
                <li class="house_container_detail">
                  <div>
                    <span class="officename">{{item.zh_name}}</span>
                    <img src="../../assets/img/zheng.png" alt class="zheng" />
                  </div>
                  <div>
                    <p class="address">{{item.zh_addr}}</p>
                  </div>
                  <!-- <div>
                    <span v-for="(tag,index) in item.label_info.slice(0,6)" class="tag">{{tag}}</span>
                  </div> -->
                  <div style="margin-top:10px;">
                    <span v-if="item.list_type == 2">
                      <span
                        v-for="(tags,index) in item.list_data"
                        :key="index"
                        class="acreagelist"
                      >{{tags}}人</span>
                    </span>
                    <span v-else v-for="(tags,index) in item.list_data.slice(0,6)" class="acreagelist">{{tags}}m²</span>
                    <span class="acreagelist" v-if="item.list_data.length > 6">
                      <el-dropdown trigger="hover">
                        <span class="el-dropdown-link" style>...</span>
                      </el-dropdown>
                    </span>
                  </div>
                </li>
                <li class="house_container_intro">
                  <div class="pricebox">
                    <span class="price" v-if="price_order ==''">
                      {{item.final_price}}
                      <span style="font-size:16px;margin-left:5px;">{{item.price_unit_name}}起</span>
                    </span>
                    <span class="price" v-else-if="price_order !=''">
                      {{item.final_price}}
                      <span style="font-size:16px;margin-left:5px;">{{item.price_unit_name}}起</span>
                    </span>
                    <span class="price" v-else>暂无价格</span>
                  </div>
                  <div class="preferentialbox">
                    <div class="preferential">
                      <el-tooltip class="item" effect="dark" content="房大优选" placement="bottom" v-if="item.is_hot==1">
                        <img src="https://images.zoomoffices.com/cnImages/icon/youxuan.png"  v-if="item.is_hot==1" alt srcset class="youxuan_img" style='height:20px;width:20px'/> 
                      </el-tooltip>
                      <el-tooltip class="item" effect="dark" content="一口价" placement="bottom" v-if="item.is_ykprice==1">
                        <img src="https://images.zoomoffices.com/cnImages/icon/yikoujia.png" v-if="item.is_ykprice==1" alt srcset class="preferential_img" style='height:20px;width:20px'/>  
                      </el-tooltip>
                    </div>
                    </div>
                  <div class="morebox" v-if="showbtn&&index == currentindex">
                    <el-button class="showmore">查看更多</el-button>
                  </div>
                </li>
              </ul>
            </router-link>
          </li>
        </ul>
        <div class="footer_page" v-if="this.houselist.length >0">
          <el-pagination
            background
            :current-page="pageNum"
            prev-text="上一页"
            next-text="下一页"
            :page-sizes="sizelist"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            layout="total,  prev, pager, next, jumper"
            :total="total"
          ></el-pagination>
        </div>
      </div>
      <div class="house_box_right" v-if="this.houselist.length > 0">
        <div :class="{ isFixed: searchBarFixed, isAbsolute: hasAbso}">
          <div id="allmap" :style="{height:mapheight}"></div>
        </div>
      </div>
    </div>
    <div id='infowindow' style='display:none;position: absolute;z-index:10000;width:250px;background:#FFF;'></div>
  </div>
</template>
<script>
import { mapState, mapActions } from "vuex";
import {
  getCitylist,
  getHouselist,
  getSubwaylist,
  getRegionlist
} from "@/api/office";
export default {
  metaInfo: {
    title: "找办公空间",
    meta: [
      {
        name: "keywords",
        content:
          "办公,租赁,房源,生意经,活动,活动详情,帮助,找办公空间,办公环境搜索,办公空间筛选,办公环境"
      },
      {
        name: "description",
        content: "房大办公找办公空间"
      }
    ]
  },
  name: "Office",
  data() {
    return {
      orderIndex:0,
      price_order:'', // 价格排序
      showprice:1,
      backgroundIndex:0,
      lineheight:'50px',
      houselistIndex: 0,
      city_id: this.$route.params.id,
      currentindex: 0,
      // 分页参数
      total: 1000,
      pageNum: 1,
      pageSize: 10,
      sizelist: [10, 20, 30, 40], // 每页条数
      xuanranjieguo:{},
      index: -1,
      office_citylist: [],
      old_citylist: [],
      city_index: 0,
      showcitys: 0,
      area_index: 0,
      subway_index: 0,
      areas_index: 0,
      chooseArea: 3,
      chooseArealist: 0,
      price_index: 0,
      person_index: 0,
      type: 0,
      mapheight:0,
      searchWord:'',
      officetype: [
        { zh_name: "共享办公", inds: 1, id: "1" },
        { zh_name: "传统办公", inds: 2, id: "2" }
      ],
      position: [{ zh_name: "区域", index: 1 }, { zh_name: "地铁", index: 2 }],
      position_index: 1, // 位置

      subwaylist: [], // 地铁线路
      subwaylists: [], // 地铁线路
      subwayarrow: 0,
      arealist: [], // 区域列表
      arealists: [], // 区域列表

      showPrices: 0,
      showPerson: 1,
      list: [
        // 默认城市列表
        { zh_name: "北京", id: "5", inds: "0" },
        { zh_name: "上海", id: "3", inds: "1" },
        { zh_name: "广州", id: "4", inds: "2" },
        { zh_name: "深圳", id: "1", inds: "3" },
        { zh_name: "香港", id: "10", inds: "4" },
        { zh_name: '成都', id: '12',inds: "5"},
        { zh_name: '重庆', id:'13',inds: "6"},
        { zh_name:'杭州',  id:'28',inds: "7"},
        { zh_name:'南京',  id:'48',inds: "8"},
        { zh_name:'西安',  id:'90',inds: "9"},
      ],
      pricelist: [
        // 价格列表
        { zh_name: "不限", ind: "", lowPrice: "", highPrice: "", id: "0" },
        {
          zh_name: "元 / m² / 天",
          ind: "-",
          lowPrice: "0",
          highPrice: "3",
          id: "1"
        },
        {
          zh_name: "元 / m² / 天",
          ind: "-",
          lowPrice: "4",
          highPrice: "5",
          id: "2"
        },
        {
          zh_name: "元 / m² / 天",
          ind: "-",
          lowPrice: "6",
          highPrice: "7",
          id: "3"
        },
        {
          zh_name: "元 / m² / 天",
          ind: "-",
          lowPrice: "8",
          highPrice: "9",
          id: "4"
        },
        {
          zh_name: "元 / m² / 天",
          ind: "-",
          lowPrice: "10",
          highPrice: "12",
          id: "5"
        },
        {
          zh_name: "元 / m² / 天 以上",
          ind: "",
          lowPrice: "12",
          highPrice: "",
          id: "6"
        }
      ],
      pricelists: [
        // 价格列表
        { zh_name: "不限", ind: " ", lowPrice: "", highPrice: "", id: "0" },
        {
          zh_name: "元 / 人 / 月",
          ind: "-",
          lowPrice: "0",
          highPrice: "1000",
          id: "1"
        },
        {
          zh_name: "元 / 人 / 月",
          ind: "-",
          lowPrice: "1000",
          highPrice: "2000",
          id: "2"
        },
        {
          zh_name: "元 / 人 / 月",
          ind: "-",
          lowPrice: "2000",
          highPrice: "3000",
          id: "3"
        },
        {
          zh_name: "元 / 人 / 月",
          ind: "-",
          lowPrice: "3000",
          highPrice: "4000",
          id: "4"
        },
        {
          zh_name: "元 / 人 / 月",
          ind: "-",
          lowPrice: "4000",
          highPrice: "5000",
          id: "5"
        }
      ],
      personlists: [
        // 人数列表
        {
          zh_name: "不限",
          ind: " ",
          lowPerson: "",
          highPerson: "",
          id: "0",
          inds: "0"
        },
        {
          zh_name: "人",
          ind: "-",
          lowPerson: "1",
          highPerson: "5",
          id: "1",
          inds: "1"
        },
        {
          zh_name: "人",
          ind: "-",
          lowPerson: "6",
          highPerson: "10",
          id: "2",
          inds: "2"
        },
        {
          zh_name: "人",
          ind: "-",
          lowPerson: "11",
          highPerson: "20",
          id: "3",
          inds: "3"
        },
        {
          zh_name: "人",
          ind: "-",
          lowPerson: "21",
          highPerson: "30",
          id: "4",
          inds: "4"
        },
        {
          zh_name: "人",
          ind: "-",
          lowPerson: "31",
          highPerson: "50",
          id: "5",
          inds: "5"
        },
        {
          zh_name: "人以上",
          ind: " ",
          lowPerson: "50",
          highPerson: "",
          id: "6",
          inds: "6"
        }
      ],
      acreagelist: [
        // 面积
        {
          zh_name: "不限",
          ind: "",
          lowArea: "",
          highArea: "",
          id: "0",
          inds: "0"
        },
        {
          zh_name: "m²",
          ind: "-",
          lowArea: "0",
          highArea: "100",
          id: "1",
          inds: "1"
        },
        {
          zh_name: "m²",
          ind: "-",
          lowArea: "100",
          highArea: "300",
          id: "2",
          inds: "2"
        },
        {
          zh_name: "m²",
          ind: "-",
          lowArea: "300",
          highArea: "500",
          id: "3",
          inds: "3"
        },
        {
          zh_name: "m²",
          ind: "-",
          lowArea: "500",
          highArea: "1000",
          id: "4",
          inds: "4"
        },
        {
          zh_name: "m²以上",
          ind: "",
          lowArea: "1000",
          highArea: "",
          id: "5",
          inds: "5"
        }
      ],
      // 房源列表
      houselist: [],
      // 搜索房源列表参数
      positionId: 0,
      searchparams: {
        type: 1, // 办公室类型
        positionType: 0,
        cityId: "5",
        lowPrice: 0,
        highPrice: 0,
        lowPerson: 0,
        highPerson: 0,
        lowArea: 0,
        highArea: 0
      },

      // 每个筛选数组
      cityarr: [],
      typearr: [],
      positionarr: [],
      regionarrr: [],
      // subwayarr:[],
      pricearr: [],
      personarr: [],
      areaarr: [],
      showbtn: false,
      searchBarFixed: false,
      hasAbso:false,
      SelectBarFixed: false,
      infoPoints:'',
      taglist:[
        {
          // src:require('../../assets/img/owners.png'),
          src:'https://images.zoomoffices.com/cnImages/icon/list-01.png',
          label:'真业主保证',
        },
        {
          // src:require('../../assets/img/commission.png'),
          src:'https://images.zoomoffices.com/cnImages/icon/list-02.png',
          label:'0服务费保证',
        },
        {
          src:"https://images.zoomoffices.com/cnImages/icon/list-03.png",
          label:'不租贵保证',
        },
        {
          src:'https://images.zoomoffices.com/cnImages/icon/list-04.png',
          label:'90秒快速响应',
        },
      ]
    };
  },

  created() {
    this.$root.bLoading = true;
    this.$root.goIndex=1;
    this.$root.moveIndex=1;
    if (window.localStorage.keyword) {
      if(this.$route.query&&this.$route.query.searchIndex==1){
         this.searchWord = window.localStorage.keyword;
      }else{
         this.searchWord='';
         window.localStorage.keyword='';
      }
    } else {
      this.searchWord=''
      window.localStorage.keyword=''
      
    }
    if (window.localStorage.type) {
      if(window.localStorage.type==0){
        if(this.$route.query&&this.$route.query.searchIndex==1){
          this.type=-1
        }else{
          window.localStorage.setItem("type", 1);
          this.typearr = [];
          this.typearr.push({
            zh_name: "共享办公",
            id: 1
          });
          this.showPrices = Number(window.localStorage.type) - 1;
          this.type=0
        }
        
      }else{
        this.type = Number(window.localStorage.type) - 1;
        this.typearr = [];
        this.typearr.push({
        zh_name: this.officetype[Number(window.localStorage.type) - 1].zh_name,
        id: this.officetype[Number(window.localStorage.type) - 1].id
      });
         this.showPrices = Number(window.localStorage.type) - 1;
      }
      
    } else {
      window.localStorage.setItem("type", 1);
      this.typearr = [];
      this.typearr.push({
        zh_name: "共享办公",
        id: 1
      });
      this.showPrices = Number(window.localStorage.type) - 1;
      this.type=0
    }

    if (window.localStorage.positionType) {
      if(window.localStorage.positionType==0){
        if(this.$route.query&&this.$route.query.searchIndex==1){
            this.position_index=-1
        }else{
            this.position_index=1
            window.localStorage.setItem("positionType", 1);
        }
      }else{
        this.position_index = Number(window.localStorage.positionType);
      }
      
    } else {
      window.localStorage.setItem("positionType", 1);
      this.position_index = 1;
    }


    
    if (window.localStorage.keyword) {
      
    } else {
      window.localStorage.setItem("keyword", '');
    }
    if (window.localStorage.pageNum) {
      this.pageNum = Number(window.localStorage.pageNum);
    } else {
      window.localStorage.setItem("pageNum", 1);
    }

    if (window.localStorage.positionId) {
      if (window.localStorage.positionId != 0) {
        this.regionarrr = [];
        this.regionarrr.push({
          zh_name: window.localStorage.positionIdName,
          id: window.localStorage.positionId
        });
        if (window.localStorage.positionType == 1) {
          this.area_index = Number(window.localStorage.positionIdIndex);
          this.subway_index = 0;
        } else {
          this.subway_index = Number(window.localStorage.positionIdIndex);
          this.area_index = 0;
        }
      } else {
        this.area_index = 0;
        this.subway_index = 0;
      }
    } else {
      window.localStorage.setItem("positionId", 0);
    }
    if (window.localStorage.lowPrice) {
      if (window.localStorage.type == 1) {
        if (
          window.localStorage.lowPrice == 0 &&
          window.localStorage.highPrice == 0
        ) {
          this.price_index = 0;
        } else if (
          window.localStorage.lowPrice == 0 &&
          window.localStorage.highPrice == 1000
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 1;
        } else if (
          window.localStorage.lowPrice == 1000 &&
          window.localStorage.highPrice == 2000
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 2;
        } else if (
          window.localStorage.lowPrice == 2000 &&
          window.localStorage.highPrice == 3000
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 3;
        } else if (
          window.localStorage.lowPrice == 3000 &&
          window.localStorage.highPrice == 4000
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 4;
        } else if (
          window.localStorage.lowPrice == 4000 &&
          window.localStorage.highPrice == 5000
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 5;
        } else {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            window.localStorage.lowPrice +
            "-" +
            window.localStorage.highPrice +
            "元 / 人 / 月";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = -1;
        }
      } else if (window.localStorage.type == 2) {
        if (
          window.localStorage.lowPrice == 0 &&
          window.localStorage.highPrice == 0
        ) {
          this.price_index = 0;
        } else if (
          window.localStorage.lowPrice == 0 &&
          window.localStorage.highPrice == 3
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 1;
        } else if (
          window.localStorage.lowPrice == 4 &&
          window.localStorage.highPrice == 5
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 2;
        } else if (
          window.localStorage.lowPrice == 6 &&
          window.localStorage.highPrice == 7
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 3;
        } else if (
          window.localStorage.lowPrice == 8 &&
          window.localStorage.highPrice == 9
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 4;
        } else if (
          window.localStorage.lowPrice == 10 &&
          window.localStorage.highPrice == 12
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 5;
        } else if (
          window.localStorage.lowPrice == 12 &&
          window.localStorage.highPrice >= 12
        ) {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name = this.searchparams.lowPrice + "元 / m² /天以上";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = 6;
        } else {
          this.searchparams.lowPrice = window.localStorage.lowPrice;
          this.searchparams.highPrice = window.localStorage.highPrice;
          let zh_name =
            this.searchparams.lowPrice +
            "-" +
            this.searchparams.highPrice +
            "元 / m² /天";
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: window.localStorage.lowPrice,
            highPrice: window.localStorage.highPrice
          });
          this.price_index = -1;
        }
      }
    } else {
      window.localStorage.setItem("lowPrice", 0);
    }
    if (window.localStorage.highPrice) {
    } else {
      window.localStorage.setItem("highPrice", 0);
    }


    if (window.localStorage.lowPerson) {
      
      if (
        window.localStorage.lowPerson == 0 &&
        window.localStorage.highPerson == 0
      ) {
        this.person_index = 0;
      } else if (
        window.localStorage.lowPerson == 1 &&
        window.localStorage.highPerson == 5
      ) {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name = window.localStorage.lowPerson + "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        this.person_index = 1;
      } else if (
        window.localStorage.lowPerson == 6 &&
        window.localStorage.highPerson == 10
      ) {
        
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name =
          window.localStorage.lowPerson +
          "-" +
          window.localStorage.highPerson +
          "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        this.person_index = 2;
        
      } else if (
        window.localStorage.lowPerson == 11 &&
        window.localStorage.highPerson == 20
      ) {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name =
          window.localStorage.lowPerson +
          "-" +
          window.localStorage.highPerson +
          "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        
        this.person_index = 3;
      } else if (
        window.localStorage.lowPerson == 21 &&
        window.localStorage.highPerson == 30
      ) {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name =
          window.localStorage.lowPerson +
          "-" +
          window.localStorage.highPerson +
          "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        this.person_index = 4;
      } else if (
        window.localStorage.lowPerson == 31 &&
        window.localStorage.highPerson == 50
      ) {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name =
          window.localStorage.lowPerson +
          "-" +
          window.localStorage.highPerson +
          "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        this.person_index = 5;
      } else if (
        window.localStorage.lowPerson == 50 &&
        window.localStorage.highPerson >= 50
      ) {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name = window.localStorage.lowPerson + "人以上";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: window.localStorage.lowPerson,
          highPerson: window.localStorage.highPerson
        });
        this.person_index = 6;
      } else {
        this.searchparams.lowPerson = window.localStorage.lowPerson;
        this.searchparams.highPerson = window.localStorage.highPerson;
        let zh_name =
          this.searchparams.lowPerson +
          "-" +
          this.searchparams.highPerson +
          "人";
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: this.searchparams.lowPerson,
          highPerson: this.searchparams.highPerson
        });
        this.person_index = -1;
      }
    } else {
      window.localStorage.setItem("lowPerson", 0);
    }
    if (window.localStorage.highPerson) {
      if (
        window.localStorage.highPerson > 200 &&
        window.localStorage.lowPerson != 50
      ) {
        this.person_index = -1;
      }
     
      if (
        window.localStorage.highPerson <= 200 &&
        window.localStorage.lowPerson >= 50
      ) {
        this.person_index = 6;
      }
    } else {
      window.localStorage.setItem("highPerson", 0);
    }
    if (window.localStorage.lowArea) {
      if (
        window.localStorage.lowArea == 0 &&
        window.localStorage.highArea == 0
      ) {
        this.areas_index = 0;
      } else if (
        window.localStorage.lowArea == 0 &&
        window.localStorage.highArea == 100
      ) {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name =
          this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = 1;
      } else if (
        window.localStorage.lowArea == 100 &&
        window.localStorage.highArea == 300
      ) {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name =
          this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = 2;
      } else if (
        window.localStorage.lowArea == 300 &&
        window.localStorage.highArea == 500
      ) {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name =
          this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = 3;
      } else if (
        window.localStorage.lowArea == 500 &&
        window.localStorage.highArea == 1000
      ) {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name =
          this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = 4;
      } else if (
        window.localStorage.lowArea == 1000 &&
        window.localStorage.highArea >= 1000
      ) {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name = this.searchparams.lowArea + "m²以上";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = 5;
      } else {
        this.searchparams.lowArea = window.localStorage.lowArea;
        this.searchparams.highArea = window.localStorage.highArea;
        let zh_name =
          this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        this.areas_index = -1;
      }
    } else {
      window.localStorage.setItem("lowArea", 0);
    }
    if (window.localStorage.highArea) {
      if (
        window.localStorage.highArea > 1000 &&
        window.localStorage.lowArea != 1000
      ) {
        this.areas_index = -1;
      }
    } else {
      window.localStorage.setItem("highArea", 0);
    }
  },
  methods: {
    InitSelectData() {
      if (window.sessionStorage.getItem("houses")) {
        let houseArr = JSON.parse(window.sessionStorage.getItem("houses"))
         
        let SelectObj = this.sharesObj;
        let pageObj = JSON.parse(window.sessionStorage.getItem("houses"));

        this.total = pageObj.all_num;
        this.pageSize = pageObj.now_page_num;
        this.houselist = houseArr;
        setTimeout(() => {
          if (this.houselist && this.houselist.length != 0) {
            this.initBMap();
          }
        }, 500);
        for (let c = 0; c < this.list.length; c++) {
          if (SelectObj.cityId == this.list[c].id) {
            this.cityarr = [];
            this.cityarr.push(this.list[c]);
            this.city_index = Number(this.list[c].inds);
          }
        }
        for (let i = 0; i < this.officetype.length; i++) {
          //
          if (SelectObj.type == this.officetype[i].id) {
            this.typearr.push(this.officetype[i]);
            this.type = this.officetype[i].inds - 1;
          }
        }
        if (SelectObj.type == "1") {
          if (SelectObj.lowPerson == 1 && SelectObj.highPerson == 15) {
            this.personarr = [];
            if (this.houselist && this.houselist.length != 0) {
              this.initBMap();
            }
          } else if (SelectObj.lowPerson == 50 && SelectObj.highPerson == 99) {
            let str =
              SelectObj.lowPerson + SelectObj.ind + SelectObj.highPerson + "人";
            this.personarr.push({
              lowPerson: SelectObj.lowPerson,
              ind: SelectObj.ind,
              highPerson: SelectObj.highPerson,
              zh_name: str
            });
            if (this.houselist && this.houselist.length != 0) {
              this.initBMap();
            }
          } else if (
            SelectObj.lowPerson == 100 &&
            SelectObj.highPerson == 1000
          ) {
            let str = SelectObj.lowPerson + "人以上";
            this.personarr.push({
              lowPerson: SelectObj.lowPerson,
              ind: SelectObj.ind,
              highPerson: SelectObj.highPerson,
              zh_name: str
            });
            if (this.houselist && this.houselist.length != 0) {
              this.initBMap();
            }
          } else if (SelectObj.lowPerson == 1 && SelectObj.highPerson != 15) {
            let str =
              SelectObj.lowPerson + SelectObj.ind + SelectObj.highPerson + "人";
            this.personarr.push({
              lowPerson: SelectObj.lowPerson,
              ind: SelectObj.ind,
              highPerson: SelectObj.highPerson,
              zh_name: str
            });
            if (this.houselist && this.houselist.length != 0) {
              this.initBMap();
            }
          }
        } else {
          let SelectObj = this.sharesObj;
          if (SelectObj.lowArea == "0" && SelectObj.highArea == "100") {
            this.areaarr = [];
          } else if (
            SelectObj.lowArea == "1000" &&
            SelectObj.highArea == "10000"
          ) {
            let str = SelectObj.lowArea + "m²以上";
            this.areaarr.push({
              lowArea: SelectObj.lowArea,
              highArea: SelectObj.highArea,
              zh_name: str
            });
          } else if (
            SelectObj.lowArea == "200" &&
            SelectObj.highArea == "300"
          ) {
            let str =
              SelectObj.lowArea + SelectObj.ind + SelectObj.highArea + "m²";
            this.areaarr.push({
              lowArea: SelectObj.lowArea,
              ind: SelectObj.ind,
              highArea: SelectObj.highArea,
              zh_name: str
            });
          } else if (SelectObj.lowArea == "0") {
            let str =
              SelectObj.lowArea + SelectObj.ind + SelectObj.highArea + "m²";
            this.areaarr.push({
              lowArea: SelectObj.lowArea,
              ind: SelectObj.ind,
              highArea: SelectObj.highArea,
              zh_name: str
            });
          } else {
            for (let l = 0; l < this.acreagelist.length; l++) {
              if (
                SelectObj.lowArea == this.acreagelist[l].lowArea &&
                SelectObj.highArea == this.acreagelist[l].highArea
              ) {
                let str =
                  SelectObj.lowArea +
                  this.acreagelist[l].ind +
                  SelectObj.highArea +
                  this.acreagelist[l].zh_name;
                this.areaarr.push({
                  lowArea: this.acreagelist[l].lowArea,
                  ind: this.acreagelist[l].ind,
                  highArea: this.acreagelist[l].highArea,
                  zh_name: str
                });
                this.areas_index = Number(this.acreagelist[l].inds);
              }
            }
          }
          if (SelectObj.lowArea == 100) {
            this.searchparams.lowArea = JSON.stringify(SelectObj.lowArea);
            this.searchparams.highArea = JSON.stringify(SelectObj.highArea);
            let str =
              SelectObj.lowArea + SelectObj.ind + SelectObj.highArea + "m²";
            this.areaarr.push({
              lowArea: SelectObj.lowArea,
              ind: SelectObj.ind,
              highArea: SelectObj.highArea,
              zh_name: str
            });
          }
        }
      } else {
        this.city_id = this.sharesObj.cityid;
        var citys = "";
        for (let i = 0; i < this.list.length; i++) {
          if (window.sessionStorage.getItem("city") == this.list[i].zh_name) {
            this.cityarr.push({
              zh_name: window.sessionStorage.getItem("city"),
              id: this.list[i].id
            });
            this.city_index = Number(this.list[i].inds);
          }
          for (let i = 0; i < this.old_citylist.length; i++) {
            if (
              window.sessionStorage.getItem("city") ==
              this.old_citylist[i].zh_name
            ) {
              citys = Number(this.old_citylist[i].id);
            }
          }
        }
        this.city_id = citys;
        this.fetchHouselist();
      }
    },
    searchResult(){

    },
    showcitymarks(item, index) {
      //选择城市
      this.city_index = item.id;
      window.localStorage.setItem("cityId", item.id);
      window.localStorage.setItem("positionId", 0);
      window.localStorage.setItem("city", item.zh_name);
      this.area_index = 0;
      this.subway_index = 0;
      this.showcitys = 0;
      if (this.cityarr.length > 0) {
        this.cityarr = [];
        this.cityarr.push({
          zh_name: item.zh_name,
          id: item.id
        });
        this.$set(this.cityarr, 0, item);
        this.regionarrr = [];
        this.city_id = item.id;
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchRegionlist();
        this.fetchSubwaylist();
        this.fetchHouselist();
        for (let i = 0; i < this.cityarr.length; i++) {
          if (item.zh_name == this.cityarr[i].zh_name) {
            return;
          }
        }
      } else {
        this.cityarr.push({
          zh_name: item.zh_name,
          id: item.id
        });
        this.$set(this.cityarr, 0, item);
        this.city_id = item.id;
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchRegionlist();
        this.fetchSubwaylist();
        this.fetchHouselist();
      }
    },

    showtype(item, index) {
      // 选择类型
      window.localStorage.setItem("type", item.id);

      window.localStorage.setItem("lowPerson", 0);
      window.localStorage.setItem("highPerson", 0);
      window.localStorage.setItem("lowPrice", 0);
      window.localStorage.setItem("highPrice", 0);
      // window.localStorage.setItem('lowArea',0)
      // window.localStorage.setItem('highArea',0)
      this.price_index = 0;
      this.person_index = 0;
      // this.areas_index=0
      this.pricearr = [];
      this.personarr = [];
      //  this.areaarr=[]
      this.showPrices = index;
      this.searchparams.type = index + 1;
      this.type = index;
      if (this.typearr.length > 0) {
        this.typearr = [];
        this.typearr.push({
          zh_name: item.zh_name,
          id: item.id
        });
        this.$set(this.typearr, 0, item);
        this.searchparams.type = index + 1;
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
        for (let i = 0; i < this.typearr.length; i++) {
          if (item.zh_name == this.typearr[i].zh_name) {
            return;
          }
        }
      } else {
        this.typearr.push({
          zh_name: item.zh_name,
          id: item.id
        });
        this.searchparams.type = index + 1;
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      }
    },

    showposition(item, index) {
      // if(index == 0){
      //   this.position_index = index;
      //   this.chooseArea = index;
      //   this.searchparams.positionType = item.index;
      //   this.positionId = item.index;
      //   this.fetchRegionlist()
      // }else{
      this.position_index = item.index;
      this.chooseArea = index;
      this.searchparams.positionType = item.index;
      this.positionId = item.index;
      window.localStorage.setItem("positionType", item.index);
      window.localStorage.setItem("positionId", 0);
      if (window.localStorage.positionType == 1) {
        // this.area_index = Number(window.localStorage.positionIdIndex);
        this.subway_index = 0;
        this.subwayarr = [];
      } else {
        // this.subway_index= Number(window.localStorage.positionIdIndex);
        this.area_index = 0;
        this.areaarr = [];
      }

      // this.fetchSubwaylist();
      // }
      // 选择位置
    },
    showarea(item, index) {
      // 选择区域
      this.area_index = index;
      if (this.regionarrr.length > 0) {
        this.regionarrr = [];
        if (item.id == 0) {
          this.regionarrr.push({
            zh_name: "区域" + item.zh_name,
            id: item.id
          });
          let objarea = new Object();
          objarea.id = item.area_id;
          objarea.zh_name = "区域" + item.zh_name;
          this.$set(this.regionarrr, 0, objarea);
          this.positionId = item.id;
          window.localStorage.setItem("positionId", item.id);

          window.localStorage.setItem("positionIdName", item.zh_name);
          window.localStorage.setItem("positionIdIndex", index);
          this.regionarrr = [];
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        } else {
          this.regionarrr.push({
            zh_name: item.zh_name,
            id: item.id
          });
          this.positionId = item.id;
          window.localStorage.setItem("positionId", item.id);
          window.localStorage.setItem("positionIdName", item.zh_name);
          window.localStorage.setItem("positionIdIndex", index);
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        }
        for (let i = 0; i < this.regionarrr.length; i++) {
          if (item.zh_name == this.regionarrr[i].zh_name) {
            return;
          }
        }
        this.positionId = item.id;
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      } else {
        if (item.id == 0) {
          // this.regionarrr.push({
          //   zh_name:"区域"+item.zh_name,
          //   id: item.id
          // });
          this.regionarrr = [];
        } else {
          this.regionarrr.push({
            zh_name: item.zh_name,
            id: item.id
          });
        }
        this.positionId = item.id;
        window.localStorage.setItem("positionId", item.id);
        window.localStorage.setItem("positionIdName", item.zh_name);

        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      }
    },
    showsubway(item, index) {
      // 选择地铁
      this.subway_index = index;
      if (this.regionarrr.length > 0) {
        this.regionarrr = [];
        if (item.route_id == 0) {
          this.regionarrr = [];
          // this.regionarrr.push({
          //   zh_name: item.route_name,
          //   id: item.route_id
          // });
          // let objarea = new Object();
          // objarea.id = item.route_id;
          // objarea.zh_name = "地铁"+ item.route_name;

          // this.$set(this.regionarrr,0,objarea);
        } else {
          this.regionarrr = [];
          this.regionarrr.push({
            zh_name: item.route_name,
            id: item.route_id
          });
        }
        for (let i = 0; i < this.regionarrr.length; i++) {
          if (item.route_name == this.regionarrr[i].route_name) {
            return;
          }
        }
        this.positionId = item.route_id;
        window.localStorage.setItem("positionId", item.route_id);
        window.localStorage.setItem("positionIdName", item.route_name);
        window.localStorage.setItem("positionIdIndex", index);
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      } else {
        if (item.subway_id == 0) {
          // this.regionarrr.push({
          //   zh_name: "地铁"+item.route_name,
          //   id: item.route_id
          // });
          this.regionarrr = [];
        } else {
          this.regionarrr = [];
          this.regionarrr.push({
            zh_name: item.route_name,
            id: item.route_id
          });
        }
        this.positionId = item.route_id;
        window.localStorage.setItem("positionId", item.route_id);
        window.localStorage.setItem("positionIdName", item.route_name);
        window.localStorage.setItem("positionIdIndex", index);
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      }

    },
    ChoosePrice(item, index) {
      // 选择价格
      this.price_index = index;
      if (this.pricearr.length > 0) {
        this.pricearr = [];
        let str = item.lowPrice + item.ind + item.highPrice + item.zh_name;
        if (item.id == 0) {
          this.searchparams.lowPrice = 0;
          this.searchparams.highPrice = 0;

          window.localStorage.setItem("lowPrice", 0);
          window.localStorage.setItem("highPrice", 0);

          // if(item.lowPrice == 12){
          //   this.searchparams.highPrice = 0;
          //   window.localStorage.setItem('highPrice', 0)
          // }
          // else{
          //   this.searchparams.highPrice = item.highPrice;
          //   window.localStorage.setItem('highPrice', item.highPrice)
          // }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
          this.$set(this.pricearr, 0, zh_name);
        } else {
          if (item.lowPrice == 12) {
            this.searchparams.highPrice = 0;
            this.searchparams.highPrice = 1000;
            window.localStorage.setItem("highPrice", 1000);
          } else {
            this.searchparams.highPrice = item.highPrice;
            window.localStorage.setItem("highPrice", item.highPrice);
          }
          let zh_name = new Object();
          zh_name.zh_name = str;
          this.pricearr.push({
            zh_name: zh_name,
            id: item.id,
            lowPrice: item.lowPrice,
            highPrice: item.highPrice
          });
          this.searchparams.lowPrice = item.lowPrice;
          window.localStorage.setItem("lowPrice", item.lowPrice);

          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
          this.$set(this.pricearr, 0, zh_name);
        }
        for (let i = 0; i < this.pricearr.length; i++) {
          if (item.lowPrice == this.pricearr[i].lowPrice) {
            return;
          }
        }
      } else {
        let label = item.lowPrice + item.ind + item.highPrice + item.zh_name;
        if (item.id == 0) {
          this.searchparams.lowPrice = item.lowPrice;
          window.localStorage.setItem("lowPrice", 0);
          window.localStorage.setItem("highPrice", 0);
          // if(item.lowPrice == 12){
          //   this.searchparams.highPrice = 0;
          // }else{
          //   this.searchparams.highPrice = item.highPrice;
          //   window.localStorage.setItem('highPrice', item.highPrice)
          // }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        } else {
          this.pricearr.push({
            zh_name: label,
            id: item.id,
            lowPrice: item.lowPrice,
            highPrice: item.highPrice
          });
          this.searchparams.lowPrice = item.lowPrice;
          window.localStorage.setItem("lowPrice", item.lowPrice);
          if (item.lowPrice == 12) {
            this.searchparams.highPrice = 0;
            this.searchparams.highPrice = 1000;
            window.localStorage.setItem("highPrice", 1000);
          } else {
            this.searchparams.highPrice = item.highPrice;
            window.localStorage.setItem("highPrice", item.highPrice);
          }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        }
      }
    },

    showperson(item, index) {
      // 选择人数
      this.person_index = index;

      if (this.personarr.length > 0) {
        this.personarr = [];
        let str = item.lowPerson + item.ind + item.highPerson + item.zh_name;
        let zh_name = new Object();
        if (item.id == 0) {
          zh_name.zh_name = "人数" + str;
          this.searchparams.lowPerson = 0;
          this.searchparams.highPerson = 0;
          window.localStorage.setItem("lowPerson", 0);
          window.localStorage.setItem("highPerson", 0);
          // if(item.lowPerson == 16){
          //   this.searchparams.highPerson = 10000;
          //   window.localStorage.setItem('highPerson',10000)
          // }else if(item.lowPerson == 1){
          //   this.searchparams.highPerson = item.highPerson;
          //   window.localStorage.setItem('highPerson',2)

          // }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
          for (let i = 0; i < this.personarr.length; i++) {
            if (item.lowPerson == this.personarr[i].lowPerson) {
              return;
            }
          }
        } else {
          zh_name.zh_name = str;
          this.personarr.push({
            zh_name: zh_name,
            id: item.id,
            lowPerson: item.lowPerson,
            highPerson: item.highPerson
          });
          this.$set(this.personarr, 0, zh_name);
          this.searchparams.lowPerson = item.lowPerson;
          window.localStorage.setItem("lowPerson", item.lowPerson);
          if (item.lowPerson == 50) {
            this.searchparams.highPerson = 200;
            window.localStorage.setItem("highPerson", 200);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          } else if (item.lowPerson == 1) {
            this.searchparams.highPerson = 5;
            window.localStorage.setItem("highPerson", 5);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          } else {
            this.searchparams.highPerson = item.highPerson;
            window.localStorage.setItem("highPerson", item.highPerson);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          }

          for (let i = 0; i < this.personarr.length; i++) {
            if (item.lowPerson == this.personarr[i].lowPerson) {
              return;
            }
          }
        }
      } else {
        let label = item.lowPerson + item.ind + item.highPerson + item.zh_name;
        if (item.id == 0) {
          this.searchparams.lowPerson = item.lowPerson;
          window.localStorage.setItem("lowPerson", 0);
          window.localStorage.setItem("highPerson", 0);
          // if(item.lowPerson == 16){
          //   this.searchparams.highPerson = 10000;
          //   window.localStorage.setItem('highPerson',10000)
          // }
          // else{
          //   this.searchparams.highPerson = item.highPerson;
          //   window.localStorage.setItem('highPerson',item.highPerson)
          // }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        } else {
          this.personarr.push({
            zh_name: label,
            id: item.id,
            lowPerson: item.lowPerson,
            highPerson: item.highPerson
          });
          this.searchparams.lowPerson = item.lowPerson;
          window.localStorage.setItem("lowPerson", item.lowPerson);

          if (item.lowPerson == 50) {
            this.searchparams.highPerson = 200;
            window.localStorage.setItem("highPerson", 200);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          } else if (item.lowPerson == 1) {
            this.searchparams.highPerson = 5;
            window.localStorage.setItem("highPerson", 5);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          } else {
            this.searchparams.highPerson = item.highPerson;
            window.localStorage.setItem("highPerson", item.highPerson);
            this.pageNum = 1;
            window.localStorage.setItem("pageNum", 1);
            this.fetchHouselist();
          }
          // else{
          //   this.searchparams.highPerson = item.highPerson;
          //   window.localStorage.setItem('highPerson',item.highPerson)
          // }
         
        }
      }
    },
    showareas(item, index) {
      // 选择面积
      this.areas_index = index;
      if (this.areaarr.length > 0) {
        this.areaarr = [];
        let str = item.lowArea + item.ind + item.highArea + item.zh_name;
        if (item.id == 0) {
          this.searchparams.lowArea = "0";
          this.searchparams.highArea = "0";
          window.localStorage.setItem("lowArea", 0);
          window.localStorage.setItem("highArea", 0);
          // if(item.lowArea == 1000){
          //   this.searchparams.highArea = 0;
          //   window.localStorage.setItem('highArea',0)
          // }else{
          //   this.searchparams.highArea = item.highArea;
          //   window.localStorage.setItem('highArea',item.highArea)
          // }
          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        } else {
          if (item.lowArea == 1000) {
            this.searchparams.highArea = 10000;

            window.localStorage.setItem("lowArea", 1000);
            window.localStorage.setItem("highArea", 10000);
          } else {
            this.searchparams.highArea = item.highArea;
            window.localStorage.setItem("highArea", item.highArea);
          }
          let zh_name = new Object();
          zh_name.zh_name = str;
          this.areaarr.push({
            zh_name: zh_name,
            id: item.id,
            lowArea: item.lowArea,
            highArea: item.highArea
          });
          this.$set(this.areaarr, 0, zh_name);
          this.searchparams.lowArea = item.lowArea;
          window.localStorage.setItem("lowArea", item.lowArea);

          this.pageNum = 1;
          window.localStorage.setItem("pageNum", 1);
          this.fetchHouselist();
        }
        for (let i = 0; i < this.areaarr.length; i++) {
          if (item.lowArea == this.areaarr[i].lowArea) {
            return;
          }
        }
      } else {
        let label = item.lowArea + item.ind + item.highArea + item.zh_name;
        if (item.id == 0) {
          // this.areaarr.push({
          //   zh_name:"面积"+label,
          //   id: item.id,
          //   lowArea:item.lowArea,
          //   highArea:item.highArea,
          // });
          this.searchparams.lowArea = "0";
          this.searchparams.highArea = "0";
          window.localStorage.setItem("lowArea", 0);
          window.localStorage.setItem("highArea", 0);
        } else {
          if (item.lowArea == 1000) {
            this.searchparams.highArea = 10000;
            window.localStorage.setItem("lowArea", 1000);
            window.localStorage.setItem("highArea", 10000);
          } else {
            this.searchparams.highArea = item.highArea;
            window.localStorage.setItem("highArea", item.highArea);
          }
          this.areaarr.push({
            zh_name: label,
            id: item.id,
            lowArea: item.lowArea,
            highArea: item.highArea
          });
          this.searchparams.lowArea = item.lowArea;
          window.localStorage.setItem("lowArea", item.lowArea);
        }

        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      }
    },

    showmorecity() {
      this.showcitys = 1;
    },
    showmoldcity() {
      this.showcitys = 0;
    },
    showmoresubway() {
      // 更多地铁
      this.subwayarrow = 1;
    },
    showmoldsubway() {
      // 更多地铁
      this.subwayarrow = 0;
    },

    // 地图
    initBMap(){
      var isthis=this;
      // 百度地图API功能
      var mp = new BMap.Map("allmap");
      var default_lng=this.houselist[0].lng;
      var default_lat=this.houselist[0].lat;
      mp.centerAndZoom(new BMap.Point(default_lng,default_lat), 12);
      mp.enableScrollWheelZoom();
      // 复杂的自定义覆盖物
      function ComplexCustomOverlay(point, text, mouseoverText,objId,data){
        this._point = point;
        this._text = text;
        this._overText = mouseoverText;
        this._objId=objId;
        this._data=data;
        
      }
      ComplexCustomOverlay.prototype = new BMap.Overlay();
      ComplexCustomOverlay.prototype.initialize = function(map){
        this._map = map;
        var div = this._div = document.createElement("div");
        div.style.position = "absolute";
        div.style.zIndex = BMap.Overlay.getZIndex(this._point.lat);
        div.style.backgroundColor = "#ffdb00";
        div.style.color = "#ff4e00";
        div.style.height = "18px";
        div.style.padding = "2px 5px";
        div.style.lineHeight = "18px";
        div.style.whiteSpace = "nowrap";
        div.style.MozUserSelect = "none";
        div.style.fontSize = "14px";
        div.id=this._objId;
        div.data=this._data;
        var span = this._span = document.createElement("span");
        div.appendChild(span);
        span.appendChild(document.createTextNode(this._text));      
        var that = this;

        var arrow = this._arrow = document.createElement("div");
        arrow.id="arrow_"+this._objId;
        arrow.style.background = "url(https://images.zoomoffices.com/cnImages/baiduMap/label_arrow.png) no-repeat";
        arrow.style.position = "absolute";
        arrow.style.backgroundPosition = "0px -10px";
        arrow.style.width = "11px";
        arrow.style.height = "10px";
        arrow.style.top = "22px";
        arrow.style.left = "10px";
        arrow.style.overflow = "hidden";
        div.appendChild(arrow);

        var opts = {
          width: 250, // 信息窗口宽度
          height: 320, // 信息窗口高度
          enableMessage: true //设置允许信息窗发送短息
        };
        var infoWindow = new BMap.InfoWindow(content, opts);  
        
        div.onmouseover = function(ev){
          
          mouse_over(this.id,that._overText);
          var id=document.getElementById(this.id);
          
          var d=JSON.parse(id.data);

          // mp.openInfoWindow(infoWindow,this.infoPoints);

          var oEvent=ev||event;
          var oDiv=document.getElementById('infowindow');
          var pos=getPos(oEvent);
      
          oDiv.style.left=(pos.x-150)+'px';
          oDiv.style.top=(pos.y+20)+'px';
          oDiv.style.display="block";
          var op = `<div style="margin:0;paddin:0;border:0;width:250px;">`;
          op += `<img src=${d.logo} class="houseimg" style="display:inline-block;width:100%;height:166px;padding:0;">`;
          op += `<div style="margin-top:10px;font-size:18px;font-weight:bold;color:#141414;overflow: hidden;text-overflow:ellipsis;white-space: nowrap;width:100%">${d.zh_name}</div>`;
          op += `<div style="height:36px;width:100%;line-height:36px;"><div style="height:36px;width:100%;padding:0 10px;line-height:36px;" ><p style="line-height:36px;margin:0;font-size:16px;color:#ff9900;float:right;width:100px;margin-top:4px;"><span style="font-size:14px;color:#141414;line-height:36px;margin-top:3px">评分：</span>${d.score}</p><p style="height:36px;font-size:16px;font-family:Arial;float:left;margin:0;line-height:36px;font-size:24px;font-weight:bold;color:#ED4242;">${d.price}<span style="margin-left:5px;font-size:16px;color:#ED4242;font-weight:normal;">${d.price_unit_name}</span></p></div>`;
          
          op += `</div>`;
          oDiv.innerHTML=op;
        }
        div.onclick = function(){
          var id=document.getElementById(this.id);
          var cd=JSON.parse(id.data);
          
          let routeData = isthis.$router.resolve({  path: "/home/office/" + window.localStorage.cityId + "/" +  cd.id});
          window.open(routeData.href, '_blank');
        }
        div.onmouseout = function(){
          mouse_out(this.id,that._text);
          var oDiv=document.getElementById('infowindow');
          oDiv.style.display="none";
        }

        mp.getPanes().labelPane.appendChild(div);
        
        return div;
      }
      ComplexCustomOverlay.prototype.draw = function(){
        var map = this._map;
        var pixel = map.pointToOverlayPixel(this._point);
        this._div.style.left = pixel.x - parseInt(this._arrow.style.left) + "px";
        this._div.style.top  = pixel.y - 30 + "px";
      }
    // this.houselist
      //定义要展示的数据和地图上要打标签的数据
      var datas = this.houselist;
      // [
      // {"id":"mapMarker1","name":"测试1","price":"120","other":"other1","longitude":"116.407845","latitude":"39.914101"},
      // {"id":"mapMarker2","name":"测试2","price":"130","other":"other2","longitude":"116.405845","latitude":"39.912101"},
      // {"id":"mapMarker3","name":"测试3","price":"140","other":"other3","longitude":"116.408845","latitude":"39.914101"}
      // ];

    
      var showC="";
      for (var i = 0; i < datas.length; i++) {
          var id="mapMarker"+datas[i].id;
          var txt="￥"+datas[i].price;
          var mouseoverTxt="￥"+datas[i].price;
          var marker = new ComplexCustomOverlay(new BMap.Point(datas[i].lng,datas[i].lat), txt,mouseoverTxt,id,JSON.stringify(datas[i]));
          var point = new BMap.Point(datas[i].lng,datas[i].lat);
          
          var content = `<div style="margin:0;paddin:0;">`;
          content += `<img src=${datas[i].logo} class="houseimg" style="display:inline-block;width:250px;height:166px;margin:10px 0px 0px 0px;padding:0;">`;
          content += `<div style="margin-top:10px;"><span style="font-size:24px;font-weight:bold;color:#ED4242;">${datas[i].price}</span><span style="margin-top:10px;  "><span style="margin-left:5px;font-size:16px;color:#ED4242;">${datas[i].price_unit_name}</span></div>`;
          content += `<div style="height:80px;display:flex;justify-content:space-between;align-items:center;"><div style="margin-top:-40px;"><p style="height:10px;font-size:24px;color:#ff9900;"><span style="font-size:18px;color:#FFE300;">评分：</span>${datas[i].score}<p><p style="height:10px;font-size:16px;margin-top:30px;font-family:Arial;">${datas[i].zh_name}</p></div>`;
          content += `<span style="width:50px;height:50px;line-height:50px;text-align:center;font-size:12px;border-radius:50%;cursor: pointer;background:#FFE300;" onclick="godetails(${(this.searchparams.cityId,datas[i].id)})">详情</span>`;
          content += `</div>`;
          content += `</div>`;
          mp.addOverlay(marker);
          var points = datas;
          var view = mp.getViewport(eval(points));
          var mapZoom = view.zoom;
          var centerPoint = view.center;
          mp.centerAndZoom(centerPoint, mapZoom);
      }
    },
    // 切换每页条数
    handleSizeChange(val) {
      this.now_page_num = val;
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      this.fetchHouselist();
    },
    // 跳转到第几页
    handleCurrentChange(val) {
      this.pageNum = val;
      window.localStorage.setItem("pageNum", val);
      this.fetchHouselist();
    },

    // 详情页跳转
    godetail(params) {
      if (this.searchparams.cityId == "") {
        let cityId = this.city_id;
        this.$router.push({ path: "/home/office/" + cityId + "/" + params });
        window.localStorage.setItem('active_index',1)
      } else {
        let cityId = this.searchparams.cityId;
        this.$router.push({ path: "/home/office/" + cityId + "/" + params });
        window.localStorage.setItem('active_index',1)
      }
    },

    // 请求筛选城市列表
    fetchCitylist() {
      getHouselist()
        .then(res => {
          if (res.data.code == 0) {
            // this.office_citylist = res.data.data.city_info.slice(0, 8);
            this.old_citylist = res.data.data.city_info;
            if(this.$route.query&&this.$route.query.searchIndex==1){
             
               this.city_index = -1;
               if(window.localStorage.getItem("cityId")){
                 for (let i = 0; i < res.data.data.city_info.length; i++) {
                      if (
                        window.localStorage.getItem("cityId") ==
                        res.data.data.city_info[i].id
                      ) {
                        // this.city_index = Number(res.data.data.city_info[i].id);

                        window.localStorage.setItem(
                          "city",
                          res.data.data.city_info[i].zh_name
                        );
                        this.city_index = res.data.data.city_info[i].id;

                        this.cityarr = [];
                        this.cityarr.push({
                          zh_name: res.data.data.city_info[i].zh_name,
                          id: res.data.data.city_info[i].id
                        });
                      }
                 } 
               }
               this.fetchHouselist();
               this.$root.bLoading = false;

            }else{
             
              if (window.localStorage.city&&window.localStorage.city!="null") {
                
                for (let i = 0; i < res.data.data.city_info.length; i++) {
                  if (
                    window.localStorage.getItem("city") ==
                    res.data.data.city_info[i].zh_name
                  ) {
                    window.localStorage.setItem(
                      "cityId",
                      res.data.data.city_info[i].id
                    );
                    this.city_index = res.data.data.city_info[i].id;
                    this.cityarr = [];
                    this.cityarr.push({
                      zh_name: res.data.data.city_info[i].zh_name,
                      id: res.data.data.city_info[i].id
                    });
                    this.fetchHouselist();
                    this.fetchRegionlist();
                    this.fetchSubwaylist();

                    // this.city_index = Number(this.list[i].inds);
                  }
                }
                this.$root.bLoading = false;
              } else {
                var that = this;
                // let geolocation = new BMap.Geolocation();
                // geolocation.getCurrentPosition(function getinfo(position) {
                  axios({
                          method: "post",
                          url: "/api/web/home/get-city",
                          data: {}
                  }).then(xes => {
                  var city = xes.data.city_name;
                  return (function() {
                    window.localStorage.setItem("city", city);
                    var checkIndex=0;
                    for (let i = 0; i < res.data.data.city_info.length; i++) {
                      if (
                        window.localStorage.getItem("city") ==
                        res.data.data.city_info[i].zh_name
                      ) {
                        checkIndex=1;
                        // this.city_index = Number(res.data.data.city_info[i].id);

                        window.localStorage.setItem(
                          "cityId",
                          res.data.data.city_info[i].id
                        );
                        that.city_index = res.data.data.city_info[i].id;

                        that.cityarr = [];
                        that.cityarr.push({
                          zh_name: res.data.data.city_info[i].zh_name,
                          id: res.data.data.city_info[i].id
                        });

                        var reqParams = {
                          cityId: Number(window.localStorage.cityId),
                          type: Number(window.localStorage.type),
                          page: Number(window.localStorage.pageNum),
                          positionId: Number(window.localStorage.positionId),
                          positionType: window.localStorage.positionType,
                          lowPrice: Number(window.localStorage.lowPrice),
                          highPrice: Number(window.localStorage.highPrice),
                          lowArea: Number(window.localStorage.lowArea),
                          highArea: Number(window.localStorage.highArea),
                          lowPerson: Number(window.localStorage.lowPerson),
                          highPerson: Number(window.localStorage.highPerson)
                        };

                        axios({
                          method: "post",
                          url: "/api/web/list/search-list",
                          data: reqParams
                        }).then(des => {
                          if (des.data.code == 0) {
                            that.houselist = des.data.data.building_info;
                            if(that.houselist.length==0){
                                that.backgroundIndex=1
                            }else{
                                that.backgroundIndex=1
                            }

                            that.total = des.data.data.all_num;
                            that.pageSize = des.data.data.now_page_num;
                            that.fetchRegionlist();
                            that.fetchSubwaylist();
                            if (des.data.data.building_info.length > 0) {
                              that.houselist = des.data.data.building_info;

                              setTimeout(() => {
                                if (
                                  that.houselist &&
                                  that.houselist.length != 0
                                ) {
                                  that.initBMap();
                                  that.$root.bLoading = false;
                                }
                              }, 500);
                            }
                          } else {
                            this.$root.bLoading = false;
                            that.$message.error(des.data.msg);
                          }
                        });
                      }
                    }
                    if(checkIndex==0){
                        window.localStorage.setItem("city", '上海');
                        window.localStorage.setItem(
                          "cityId",
                          3
                        );
                        that.city_index = '3';
                        that.cityarr = [];
                        that.cityarr.push({
                          zh_name: '上海',
                          id: '3'
                        });

                        var reqParams = {
                          cityId: Number(window.localStorage.cityId),
                          type: Number(window.localStorage.type),
                          page: Number(window.localStorage.pageNum),
                          positionId: Number(window.localStorage.positionId),
                          positionType: window.localStorage.positionType,
                          lowPrice: Number(window.localStorage.lowPrice),
                          highPrice: Number(window.localStorage.highPrice),
                          lowArea: Number(window.localStorage.lowArea),
                          highArea: Number(window.localStorage.highArea),
                          lowPerson: Number(window.localStorage.lowPerson),
                          highPerson: Number(window.localStorage.highPerson)
                        };

                        axios({
                          method: "post",
                          url: "/api/web/list/search-list",
                          data: reqParams
                        }).then(des => {
                          if (des.data.code == 0) {
                            that.houselist = des.data.data.building_info;
                            if(that.houselist.length==0){
                                that.backgroundIndex=1
                            }else{
                                that.backgroundIndex=1
                            }

                            that.total = des.data.data.all_num;
                            that.pageSize = des.data.data.now_page_num;
                            that.fetchRegionlist();
                            that.fetchSubwaylist();
                            if (des.data.data.building_info.length > 0) {
                              that.houselist = des.data.data.building_info;

                              setTimeout(() => {
                                if (
                                  that.houselist &&
                                  that.houselist.length != 0
                                ) {
                                  that.initBMap();
                                  that.$root.bLoading = false;
                                }
                              }, 500);
                            }
                          } else {
                            this.$root.bLoading = false;
                            that.$message.error(des.data.msg);
                          }
                        });
                    }
                  })();
                });
              }
            }

          } else {
            this.$message.error(res.data.msg);
          }
        })
        .catch(error => {
        });
    },

    // 请求区域
    fetchRegionlist() {
      var reqParams = {
        city_id: window.localStorage.cityId
      };
      getRegionlist(reqParams)
        .then(res => {
          if (res.data.code == 0) {
            this.arealist = res.data.data.district_info.slice(0, 14);
            this.arealist.unshift({
              zh_name: "不限",
              id: "0"
            });
            this.arealists = res.data.data.district_info;
            this.arealists.unshift({
              zh_name: "不限",
              id: "0"
            });
          } else {
            this.$message.error(res.data.msg);
          }
        })
        .catch(error => {});
    },

    // 请求筛选地铁
    fetchSubwaylist() {
      var reqParams = {
        city_id: window.localStorage.cityId
      };
      getSubwaylist(reqParams)
        .then(res => {
          if (res.data.code == 0) {
            this.subwaylist = res.data.data.subway_info.slice(0, 14);
            this.subwaylist.unshift({
              route_name: "不限",
              route_id: "0"
            });
            this.subwaylists = res.data.data.subway_info;
            this.subwaylists.unshift({
              route_name: "不限",
              route_id: "0"
            });
          } else {
            this.$message.error(res.data.msg);
          }
        })
        .catch(error => {
          if (this.searchparams.type == 1) {
            this.$message.error("请求区域列表失败！");
          } else {
            this.$message.error("请求地铁列表失败！");
          }
        });
    },

    // 更多区域
    showmoreArea() {
      this.chooseArealist = 1;
      this.subwayarrow = 1;
    },
    showoldArea() {
      this.chooseArealist = 0;
      this.subwayarrow = 0;
    },

    // 更多区域
    showmoldSubway() {
      this.position_index = 0;
      this.subwayarrow = 0;
    },
    showmoreSubway() {
      this.position_index = 1;
      this.subwayarrow = 1;
    },

    // 查看更多
    hidemorebtn(item,index) {
      this.showbtn = false;
      this.currentindex = null;
      var obj=document.getElementById("mapMarker"+item.id);
      var objArrow=document.getElementById('arrow_'+"mapMarker"+item.id);

      obj.style.backgroundColor = "#ffdb00";
      obj.style.fontSize = "14px";
      obj.style.padding = "2px 3px";
      obj.getElementsByTagName("span")[0].innerHTML = "￥" + item.price;
      objArrow.style.backgroundPosition = "0px -10px";
      obj.style.zIndex=obj.style.zIndex*1-10000000;
    },
    changelabel(item,index) {
      this.showbtn = true;
      this.currentindex = index;
      var obj=document.getElementById("mapMarker"+item.id);
      var objArrow=document.getElementById('arrow_'+"mapMarker"+item.id);
      obj.style.backgroundColor = "#70a4f1";
      obj.style.fontSize = "14px";
      obj.style.padding = "2px 3px";
      obj.getElementsByTagName("span")[0].innerHTML =  "￥" + item.price;;
      objArrow.style.backgroundPosition = "0px -20px";
      obj.style.zIndex=obj.style.zIndex*1+10000000;
      obj.style.whiteSpace = "nowrap";
    },
    // 请求筛选结果
    fetchHouselist() {
      var reqParams = {
        cityId: Number(window.localStorage.cityId),
        type: Number(window.localStorage.type),
        page: Number(window.localStorage.pageNum),
        positionId: Number(window.localStorage.positionId),
        positionType: window.localStorage.positionType,
        lowPrice: Number(window.localStorage.lowPrice),
        highPrice: Number(window.localStorage.highPrice),
        lowArea: Number(window.localStorage.lowArea),
        highArea: Number(window.localStorage.highArea),
        lowPerson: Number(window.localStorage.lowPerson),
        highPerson: Number(window.localStorage.highPerson),
        keyword:window.localStorage.keyword,
        price_order:this.price_order,
      };
      getCitylist(reqParams).then(res => {
        if (res.data.code == 0) {
          this.houselist = res.data.data.building_info;
          if(this.houselist.length==0){
              this.backgroundIndex=1
          }else{
              this.backgroundIndex=1
          }
          this.total = res.data.data.all_num;
          this.pageSize = res.data.data.now_page_num;
          let str = JSON.stringify(res.data.data.building_info);
          window.sessionStorage.setItem("houses", str);
          this.$store.dispatch("GetSearch", this.searchparams);
          if (res.data.data.building_info.length > 0) {
            setTimeout(() => {
              if (this.houselist && this.houselist.length != 0) {
                this.initBMap();
              }
            }, 500);
          }
        } else {
          this.$message.error(res.data.msg);
        }
      });
    },
    changeOrder(){
      if(this.orderIndex == 0){
          this.highPrice();
          this.orderIndex=1;
      }else {
          this.lowerPrice()
          this.orderIndex=0;
      }
    },
    lowerPrice(){
      this.price_order = 2;
      this.showprice = 3;
      this.fetchHouselist();
    },

    highPrice(){
      this.price_order = 1;
      this.showprice = 2;
      this.fetchHouselist();
    },

    comprehensiveprice(){
      this.price_order = '';
      this.showprice = 1;
      this.fetchHouselist();
    },

    fetchDIYPrice() {
      if (this.showPrices == 1) {
        let zh_name = this.searchparams.lowPrice + "-" + this.searchparams.highPrice + "元 / m² /天";

        if (this.pricearr.length == 0) {
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: this.searchparams.lowPrice,
            highPrice: this.searchparams.highPrice
          });
          this.price_index = -1;
          window.localStorage.setItem("lowPrice", this.searchparams.lowPrice);
          window.localStorage.setItem("highPrice", this.searchparams.highPrice);
        } else {
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: this.searchparams.lowPrice,
            highPrice: this.searchparams.highPrice
          });
          window.localStorage.setItem("lowPrice", this.searchparams.lowPrice);
          window.localStorage.setItem("highPrice", this.searchparams.highPrice);
          this.price_index = -1;
        }
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      } else {
        let zh_name = this.searchparams.lowPrice + "-" + this.searchparams.highPrice +"元 / 人 / 月";

        if (this.pricearr.length == 0) {
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: this.searchparams.lowPrice,
            highPrice: this.searchparams.highPrice
          });
          window.localStorage.setItem("lowPrice", this.searchparams.lowPrice);
          window.localStorage.setItem("highPrice", this.searchparams.highPrice);
          this.price_index = -1;
        } else {
          this.pricearr = [];
          this.pricearr.push({
            zh_name: zh_name,
            lowPrice: this.searchparams.lowPrice,
            highPrice: this.searchparams.highPrice
          });
          window.localStorage.setItem("lowPrice", this.searchparams.lowPrice);
          window.localStorage.setItem("highPrice", this.searchparams.highPrice);
          this.price_index = -1;
        }
        this.pageNum = 1;
        window.localStorage.setItem("pageNum", 1);
        this.fetchHouselist();
      }
    },

    fetchDIYPerson() {
      let zh_name =
        this.searchparams.lowPerson + "-" + this.searchparams.highPerson + "人";
      if (this.personarr.length == 0) {
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: this.searchparams.lowPerson,
          highPerson: this.searchparams.highPerson
        });
        window.localStorage.setItem("lowPerson", this.searchparams.lowPerson);
        window.localStorage.setItem("highPerson", this.searchparams.highPerson);
        this.person_index = -1;
      } else {
        this.personarr = [];
        this.personarr.push({
          zh_name: zh_name,
          lowPerson: this.searchparams.lowPerson,
          highPerson: this.searchparams.highPerson
        });
        window.localStorage.setItem("lowPerson", this.searchparams.lowPerson);
        window.localStorage.setItem("highPerson", this.searchparams.highPerson);
        this.person_index = -1;
      }
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      this.fetchHouselist();
    },

    fetchDIYArea() {
      let zh_name =
        this.searchparams.lowArea + "-" + this.searchparams.highArea + "m²";

      if (this.areaarr.length == 0) {
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        window.localStorage.setItem("lowArea", this.searchparams.lowArea);
        window.localStorage.setItem("highArea", this.searchparams.highArea);
        this.areas_index = -1;
      } else {
        this.areaarr = [];
        this.areaarr.push({
          zh_name: zh_name,
          lowArea: this.searchparams.lowArea,
          highArea: this.searchparams.highArea
        });
        window.localStorage.setItem("lowArea", this.searchparams.lowArea);
        window.localStorage.setItem("highArea", this.searchparams.highArea);
        this.areas_index = -1;
      }
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      this.fetchHouselist();
    },

    fetchdata() {
      this.fetchCitylist();
    },
    deletePosition(index) {
      this.regionarrr = [];
      this.area_index = 0;
      this.subway_index = 0;
      this.positionId = "";
      window.localStorage.setItem("positionId", 0);
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      this.fetchHouselist();
    },
    deletePrice(index) {
      this.pricearr = [];
      this.searchparams.lowPrice = 0;
      this.searchparams.highPrice = 0;
      this.price_index = 0;
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      window.localStorage.setItem("lowPrice", 0);
      window.localStorage.setItem("highPrice", 0);
      this.fetchHouselist();
    },
    deletePerson(index) {
      this.personarr = [];
      this.searchparams.lowPerson = 0;
      this.searchparams.highPerson = 0;
      this.person_index = 0;
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      window.localStorage.setItem("lowPerson", 0);
      window.localStorage.setItem("highPerson", 0);
      this.fetchHouselist();
    },
    deleteArea(index) {
      this.areaarr = [];
      this.searchparams.lowArea = 0;
      this.searchparams.highArea = 0;
      this.areas_index = 0;
      this.pageNum = 1;
      window.localStorage.setItem("pageNum", 1);
      window.localStorage.setItem("lowArea", 0);
      window.localStorage.setItem("highArea", 0);
      this.fetchHouselist();
    },
    deletesearch(){
      this.searchWord='';
      window.localStorage.keyword='';
      this.fetchHouselist();
    },

    godetails(params) {
      if (this.city_id) {
        let city = this.city_id;
        this.$router.push({ path: "/home/office/" + city + "/" + params });
        window.localStorage.setItem('active_index',1)
      } else {
        let city = this.searchparams.cityId;
        this.$router.push({ path: "/home/office/" + city + "/" + params });
        window.localStorage.setItem('active_index',1)
      }
    },

    handleScroll() {
      var scrollTop =
        window.pageYOffset ||
        document.documentElement.scrollTop ||
        document.body.scrollTop;
       if(this.houselist.length){
       
         if(scrollTop>this.houselist.length*166+370-document.documentElement.clientHeight-130&&scrollTop >document.documentElement.scrollHeight-document.documentElement.clientHeight-130-540&&this.houselist.length*166>=document.documentElement.clientHeight-130){
        //  this.mapheight=this.houselist.length*166+'px';
         this.SelectBarFixed = true;  
         this.searchBarFixed = false;
         this.hasAbso=true;
        
         }else if(scrollTop > 300&&this.houselist.length*166>=document.documentElement.clientHeight-130){
            // this.mapheight=document.documentElement.clientHeight-130+'px';
            this.SelectBarFixed = true;
            this.searchBarFixed = true;
            this.hasAbso=false;
            this.lineheight='50px';
           
            
         }else{
            // this.mapheight=document.documentElement.clientHeight-130+'px';
            this.SelectBarFixed = false;
            this.searchBarFixed = false;
            this.hasAbso=false;
            this.lineheight='50px';
          
         }
         
      }
      
    }
  },

  computed: {
    iconStyle() {
      return {
        float: "right",
        fontSize: "14px",
        marginRight: "20px"
      };
    },
    iconStyles() {
      return {
        float: "right",
        fontSize: "14px",
        marginTop: "-30px",
        marginRight: "20px",
        cursor: "pointer",
      };
    },
    Inputstyle() {
      return {
        width: "100px",
        height: "30px",
      };
    },
    deleteiconstyle() {
      return {
        // position:'absolute',
        color: "#FFDB00",
        cursor: "pointer",
        marginTop:'-10px'
      };
    },
    ...mapState({
      sharesObj() {
        return this.$store.state.sharesObj;
      }
    })
  },
  beforeRouteUpdate (to, from, next) {
      window.scrollTo(0,0); 
    },
  mounted() {
    this.mapheight=document.documentElement.clientHeight-130+'px'
    if(window.localStorage.getItem("searchIndex")){
      localStorage.removeItem("searchIndex")
      let searchouseResult=JSON.parse(window.localStorage.getItem("searchouseResult"))
      this.total = searchouseResult.all_num;
      this.pageSize = searchouseResult.now_page_num;
      this.houselist = searchouseResult.building_info;
      this.$root.bLoading = false;
      setTimeout(() => {
        if (this.houselist && this.houselist.length != 0) {
          this.initBMap();
        }
      }, 500);
    }else{
      this.fetchdata();
    }
    window.addEventListener("scroll", this.handleScroll, true);
    window.godetails = this.godetails;
  },
  destroyed() {
    window.removeEventListener("scroll", this.handleScroll);
    this.$root.moveIndex=0;
    this.sharesObj = {};
  }
};

function mouse_over(id,html){
    var obj=document.getElementById(id);
    var objArrow=document.getElementById('arrow_'+id);
    obj.style.backgroundColor = "#70a4f1";
    obj.style.fontSize = "14px";
    obj.style.padding = "2px 6px";
    obj.getElementsByTagName("span")[0].innerHTML = html;
    objArrow.style.backgroundPosition = "0px -20px";
    obj.style.zIndex=obj.style.zIndex*1+1000000000;
    obj.style.whiteSpace = "nowrap";
}
function mouse_out(id,html){
  var obj=document.getElementById(id);
  var objArrow=document.getElementById('arrow_'+id);

  obj.style.backgroundColor = "#ffdb00";
  obj.style.fontSize = "14px";
  obj.style.padding = "2px 6px";
  obj.getElementsByTagName("span")[0].innerHTML = html;
  objArrow.style.backgroundPosition = "0px -10px";
  obj.style.zIndex=obj.style.zIndex*1-1000000000;
}

function getPos(ev){
    var scrollTop=document.documentElement.scrollTop||document.body.scrollTop;
    var scrollLeft=document.documentElement.scrollLeft||document.body.scrollLeft;
    var mx={x:ev.clientX};
    var my={y:ev.clientY};
    return{x:ev.clientX+scrollLeft,y:ev.clientY+scrollTop};
}
</script>
<style lang="scss" scoped>
@import "../../style/common.scss";
@import "./Office.scss";
.el-input__inner{
  height: 30px;
}
</style>
<style type="text/css">
.anchorBL {
  display: none;
}

</style>
